<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Index</title>
    <style>

        #parent{
            position: relative;
        }

        form{
            /*width: 100%;*/
            /*height:100%;*/
            /*margin: 0 auto;*/
            height: 300px;
            width: 600px;
            position: absolute;
            /*margin-top: 40%;*/
            /*text-align: center;*/
            left: 50%;
            top: 50%;
            transform: translate(-50%,50%); /* 子盒子自身宽高的50% */
            background-image: url("https://gitee.com/bilibili_ming/ming-images/raw/master/typora/2022/02/202202270008469.png");
            text-align: center;
            /*vertical-align: center;*/

        }

        input{
            position: relative;
            box-sizing: border-box;
            width: 300px;
            height: 30px;
            margin-top: 2%;
        }


    </style>
</head>
<body>
   <div id="parent">
       <form action="/do/login.html" method="post">
           <!--        除非使用定制,否则name的属性值必须符合spring security规则-->
           <!--        除非使用定制,否则用户名对应的name为【username】-->
           <h2>登录表单</h2>
           <div>
               <input type="text" name="user" placeholder="请输入用户名" value="ming">
           </div>
           <!--        除非使用定制,否则密码对应的name为【password】-->
           <div>
               <input type="password" name="password" placeholder="请输入密码" value="ming">
           </div>
           <div>
               <input type="submit" value="登录">
           </div>
       </form>
   </div>
</body>
</html>